ko.bindingHandlers.editableText = {
    init: function(element, valueAccessor) {
        $(element).on('blur', function() {
            var observable = valueAccessor();
            observable( $(this).text() );});},
    update: function(element, valueAccessor) {
        var value = ko.utils.unwrapObservable(valueAccessor());
        $(element).text(value);}};

var MessageModel = function(messages){
  var self = this;
  self.messages = ko.observableArray(messages);

  self.addMessage = function(obj) {
    self.messages.push({
      userName: obj.userName,
      message: ko.observable(obj.message),
      time: obj.time,
      imagePath: obj.imagePath,
      isCurrent: obj.isCurrent});
      var objDiv = document.getElementById("container");
      objDiv.scrollTop = objDiv.scrollHeight;}};

var viewModel = new MessageModel();
ko.applyBindings(viewModel);

var recognition = new webkitSpeechRecognition();
recognition.lang = "en-US";


recognition.onresult = function(event){ 
    var res; 
    for (var i = event.resultIndex; i < event.results.length; ++i) {
      if (event.results[i].isFinal) {
        res = event.results[i][0].transcript;      };    }

    var messageObj = {
      userName: 'u1',
      message: res,
      time: new Date(),
      imagePath:'1.jpg',
      isCurrent: false};


    messageObj.isCurrent = true;
    viewModel.addMessage(messageObj)};





function clickButton(e){

 recognition.continuous = true;
    recognition.start();
  }



function clickStopButton(){
  
    recognition.stop();


}



/*
$(document).ready(buildApp);


function buildApp(){
  buildDom();
}




function buildDom()
{
  var supportedLangs = ['en-GB','en-US','ru-RU'];


  var innerDom = '<div id="mainDiv"><select id="select_speech_lang" data-bind="options: lang"></select><select id="select_translate_lang"></select></div>';
  var wrapper = $('#contentWrapper');
  wrapper.html(innerDom);
  for(var i =0;i<supportedLangs.length;i++)
    select_speech_lang.options[i] = new Option(supportedLangs[i],supportedLangs[i]);
  for(var i =0;i<supportedLangs.length;i++)
    select_translate_lang.options[i] = new Option(supportedLangs[i],supportedLangs[i]);
  $(select_speech_lang).change(speechLangChanged);
  $(select_translate_lang).change(speechTranslateChanged);
}

function speechLangChanged()
{

}

function speechTranslateChanged()
{
  
}
*/




/*
console.log('hello');

var recognition = new webkitSpeechRecognition();
recognition.lang = "en-GB";

recognition.continuous = true;
recognition.onresult = function(event) { 
  console.log(event); 
  var res = event.results[0][0].transcript;
  var elem = document.getElementById('div123');
  elem.innerText = res;
}
recognition.onstart = function(event) { 
  console.log('start'); 
}

console.log('hello');
*/